<template>
    <div>
        <div class="opinion-body"  v-show="isModel">
            <div class="opinion-container">
                <div class="opinion-header flex flex-align-center">
                      <p class="flex-1">{{model_name}}</p>
                      <img src="@/assets/img/business/business-close.png" alt="" @click="closeModelFun">
                </div>
                <div class="opinion-cont">
                    <div class="post-title-box flex flex-align-center">
                        <p>标题</p>
                        <input type="text" v-model="input_cont">
                        <div class="msgbox flex flex-align-center" v-show="isInputShow">
                            <img src="@/assets/img/business/business-err.png" alt="">
                            <p>请输入4-30个字的标题</p>
                        </div>
                    </div>
                    <div class="post-cont-box flex">
                        <p>内容</p>
                        <div class="text-Box">
                            <textarea name="" id="" cols="69" rows="9" v-model="text_cont"></textarea>
                            <div class="msgbox flex flex-align-center" v-show="istextBoxShow">
                            <img src="@/assets/img/business/business-err.png" alt="">
                            <p style="width: 1.8rem;">请至少输入20个字符内容</p>
                        </div>
                        </div>
                    </div>
                    <div class="btn-group flex flex-align-center">
                        <div class="btn btn-fb flex flex-align-center flex-pack-center" @click="onPostFun"><p>发表</p></div>
                        <div class="btn btn-qx flex flex-align-center flex-pack-center" @click="onQuxiaoFun"><p>取消</p></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
import https from '@/public/https'
export default {
    data () {
        return {
            model_name:'意见反馈',
            isInputShow:false,
            istextBoxShow:false,
            input_cont:'',
            text_cont:''
        }
    },
    props: {
       isModel:{
            type:Boolean,
            default:false
        }
    },
    mounted () {
        
    },
    watch: {
      input_cont(news,old){
            let lenght = this.calCount(news);
            if(lenght<8 || lenght>60){
                this.isInputShow = true;
            }else{
                this.isInputShow = false;
            }
            if(news == ''){
                 this.isInputShow = false;
            }
      },
      text_cont(news,old){
           let lenght = this.calCount(news);
            if(lenght<40 || lenght>1000){
                this.istextBoxShow = true;
            }else{
                this.istextBoxShow = false;
            }
            if(news == ''){
                 this.istextBoxShow = false;
            }
      }
    },
    methods: {
        closeModelFun(){ //控制窗口显示隐藏
            this.isInputShow = false;
            this.istextBoxShow = false;
            this.$emit('closed');
        },
        onPostFun(){ //发表
            let uid = this.$store.state.userInfo.id;
            let title = this.input_cont
            let content = this.text_cont.slice(0,500);
            if(title != '' && content != ''){
                https.post('cooperation/postAddSuggestion',{uid:uid,title:title,content:content})
                .then(data => {
                    if(data.status == 1){
                         this.input_cont = '';
                         this.text_cont = '';
                         this.$message({message: '意见反馈提交成功', type: 'success' });
                          this.$emit('closed');
                    }else{
                       this.$message.error(data.message);
                    }
                })
            }
        },
        onQuxiaoFun(){ //取消
             this.isInputShow = false;
             this.istextBoxShow = false;
             this.$emit('closed');
        },
        calCount(data){
        var Words= data;  
        var W = new Object();  
        var Result = new Array();  
        var iNumwords = 0;  
        var sNumwords = 0;  
        var sTotal = 0;//双字节字符;  
        var iTotal = 0;//中文字符；  
        var eTotal = 0;//Ｅ文字符  
        var otherTotal = 0;  
        var bTotal = 0;  
        var inum = 0;     
        for (var i=0; i<Words.length; i++) {  
            var c = Words.charAt(i);  
            if (c.match(/[\u4e00-\u9fa5]/)) {  
                if (isNaN(W[c])) {  
                    iNumwords++;  
                    W[c] = 1;  
                }  
                iTotal++;  
            }  
        }  
        for (var i=0; i<Words.length; i++) {  
            var c = Words.charAt(i);  
            if (c.match(/[^\x00-\xff]/)) {  
                if (isNaN(W[c])) {  
                    sNumwords++;  
    
                }  
                sTotal++;  
            }  
            else  
            {  
            eTotal++;  
            }  
            if (c.match(/[0-9]/)) {  
                inum++;  
            }  
        }  
        return iTotal*2+(sTotal-iTotal)*2+eTotal;  
        }
    }
}
</script>
<style lang="less" scoped>
@import url(../../assets/css/contectus/opintion.less);
</style>

